<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
    <meta content="" name="description"/>
    <meta content="" name="author"/>
    <meta name="MobileOptimized" content="320"/>
    <link href="../../resources/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="../../resources/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="../../resources/css/style-metronic.css" rel="stylesheet" type="text/css"/>
    <link href="../../resources/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>

    <style>
        #submitAdd {
            display: inline-block;
            background: #000;
            color: #FFF;
            font-size: 13px;
            line-height: 22px;
            text-transform: uppercase;
            border: none;
            outline: none;
            transition: 0.2s;
            -webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -o-transition: 0.2s;
        }
    </style>


</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body>
<div class="page-content">
    <div class="row" style="padding-left:14px; padding-right:15px">
        <div class="col-md-12">
            <h3 class="page-title" style="margin-top:22px">
                会员
                <small>管理</small>
            </h3>
            <hr/>
            <div class="container" style="margin-top:40px">
                <div class="col-md-3">
                    <h3 style="text-decoration:underline">会员办理</h3>
                </div>
                <div class="col-md-6 col-xs-12 login-right">

                    <form method="post" th:action="@{/member/memberAdd}" action="javascript:void;" onsubmit="return checkMemberArg();" style="padding-top:80px">
                        <div>
						<span>会员姓名:
						</span> <input type="text" name="memberName" id="memberName"/>
                        </div>
                        <br/>

                        <div>
					<span>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:
					</span>
                            <input type="radio" name="memberSex" value="1" style="margin-left:5px"/>男
                            <input type="radio" name="memberSex" value="2" style="margin-left:15px"/>女
                        </div>
                        <br/>

                        <div>
						<span>身份证号:
						</span> <input type="text" name="IDCardNo" id="memberID"/>
                        </div>
                        <br/>

                        <div>
						<span>手机号:&nbsp;&nbsp;&nbsp;&nbsp;
						</span> <input type="text" name="memberPhoneNumber" id="memberPhoneNumber"/>
                        </div>
                        <br/>

                        <div>
                            <span>经办人:&nbsp;&nbsp;&nbsp;&nbsp;</span>
                            <select name="userId">
                                <option th:each="user : ${users}" th:value="${user.id}" th:text="${user.name}">辣条</option>
                            </select>
                        </div>
                        <br/>
                        <hr/>
                        <input id="submitAdd" type="submit" value="提交" style="float:right;margin-top:50px"/>
                    </form>

                </div>
                <div class="clearfix"></div>
                <div class="col-md-3"></div>
            </div>

        </div>
    </div>
    <!-- END PAGE -->
</div>
<!-- END CONTAINER -->
</body>
<script type="text/javascript" src="../../resources/plugins/jquery-1.10.2.min.js" th:src="@{/resources/plugins/jquery-1.10.2.min.js}"></script>
<script src="../../resources/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript" src="../../resources/plugins/bootstrap/js/bootstrap.min.js" th:src="@{/resources/plugins/bootstrap/js/bootstrap.min.js}"></script>
<script type="text/javascript" >
    // <![CDATA[
    function trim(arg){
        var reSpace=/^\s*(.*?)\s*$/;
        return arg.replace(reSpace,"$1");
    };
    function checkMemberArg(){

        if(trim($('#memberName').val())=="") {
            alert("用户名不能为空！");
            return false;}
        if($("input[name='memberSex']:checked").val()==null){
            alert("性别未填写！");
            return false;
        }
        var idcard = $("#memberID").val();
        var idcardPattern = /^\d{15}|\d{18}$/;
        if(!idcardPattern.test(trim(idcard))){
            alert("身份证号码有误！");
            return false;
        }
        var phone = $("#memberPhoneNumber").val();
        var phonePattern = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
        if(!phonePattern.test(trim(phone))) {
            alert("手机号不合规范！");
            return false;
        }
        return true;
    }
    // ]]>
</script>

</html>
